<template>
    <el-container>
        <div id="container">
            <canvas></canvas>
        </div>
<!--        <el-button type="primary" style="height: 50px;width: 100px" @click="closeBrowserWindow">-->
<!--            关闭直播-->
<!--        </el-button>-->
    </el-container>
</template>
<style>

    #container {
        background: url(../../assets/douyin-game/matong-bg.png) no-repeat;
        height: 740px;
        width: 500px;
        margin: 0px auto;
    }

    canvas {
        /*border: 1px solid;*/
        height: 316px;
        width: 242px;
        margin: 325px 0px 0 128px;
    }

</style>
<script>
    import {init, add} from './danmu'

    export default {
        name: 'douyinGame1',
        data() {
            return {}
        },
        beforeCreate() {
            this.$electron.ipcRenderer.on('douyinLiveChatMessage', (event, arg) => {
                console.log(arg)
                add({
                    'avatar': arg.user.avatarThumb.urlList[0],
                    'content': arg.content
                })
            })
        },
        created() {
            var _this = this;
            this.$nextTick(() => {
                init()
                this.$electron.ipcRenderer.send('douyinLive', {
                    gameType: 'MaTong',
                    link: this.$route.params.link
                })
            })
            window.onbeforeunload = (e) => {
                _this.closeBrowserWindow();
                // e.returnValue = false    //是否阻止关闭
            }
        },
        methods: {
            closeBrowserWindow() {
                this.$electron.ipcRenderer.send('closeBrowserWindow');
            }
        },
    }
</script>

<style>

</style>
